<template>
    <div class="wen-box">
        <div class="wen-top">
            <router-link to="/">
                <img src="../../assets/images/fanhui.png" alt="" class="fanhui">
            </router-link>
            
            <h3>门诊列表</h3>
            <router-link to="/information">
                <img src="../../assets/images/lingdang.png" alt="" class="lingdang">
            </router-link>
        </div>
        <div class="lie">
            <router-link to="/chatroom">
                <div class="lie1">
                    <img src="../../assets/images/x6.jpg" alt="">
                    <h3>Défilé</h3>
                    <div>左眼皮一直跳怎么回事？</div>
                    <div class="time">2019/03/02</div>
                </div>
            </router-link>
            <router-link to="/chatroom">
                <div class="lie2">
                    <img src="../../assets/images/x6.jpg" alt="">
                    <h3>Défilé</h3>
                    <div>非常感谢你的热情解答...</div>
                    <div class="time">2019/02/23</div>
                </div>  
            </router-link>
            <router-link to="/chatroom">
                <div class="lie3">
                    <img src="../../assets/images/x6.jpg" alt="">
                    <h3>Défilé</h3>
                    <div>昨天下雪了，冻的我感冒了</div>
                    <div class="time">2019/02/10</div>
                </div>
            </router-link>
            <router-link to="/chatroom">
                <div class="lie4">
                    <img src="../../assets/images/x6.jpg" alt="">
                    <h3>Défilé</h3>
                    <div>[语音]</div>
                    <div class="time">2019/02/01</div>
                </div>
            </router-link>
            <router-link to="/chatroom">
                <div class="lie5">
                    <img src="../../assets/images/x6.jpg" alt="">
                    <h3>Défilé</h3>
                    <div>[图片][图片][图片]</div>
                    <div class="time">2019/01/28</div>
                </div>
            </router-link>
            
        </div>
    </div>
</template>

<script setup>


</script>

<style lang="scss" scoped>
    .wen-box{
        width: 120%;
        height: 92vh;
        margin-left: -30px;
        margin-top: -20px;
        position: relative;
        .wen-top{
            width: 100%;
            height: 40px;
            border-bottom: solid 1px #cfcccc;
            .fanhui{
                width: 25px;
                height: 25px;
                margin: 5px 10px;
            }
            h3{
                position: absolute;
                top: 5px;
                left: 150px;
                font-weight: 600;
            }
            .lingdang{
                width: 25px;
                height: 25px;
                position: absolute;
                right: 10px;
                top: 7px;
            }
        }
        .lie{
            width: 100%;
            height: 615px;
            .lie1{
                width: 100%;
                height: 65px;
                border: solid 1px #c3bcbc;
                margin-top: 5px;
                position: relative;
                img{
                    width: 50px;
                    height: 50px;
                    position: absolute;
                    border-radius: 40px;
                    top: 12px;
                    left: 20px;
                }
                h3{
                    position: absolute;
                    left: 80px;
                    top: 5px;
                    font-weight: 500;
                }
                div{
                    position: absolute;
                    left: 80px;
                    bottom: 5px;
                    font-weight: 600;
                }
                .time{
                    position: absolute;
                    left: 280px;
                    top: 5px;
                    color: #979090;
                }
            }
        }
        .lie2{
                width: 100%;
                height: 65px;
                border: solid 1px #c3bcbc;
                margin-top: -20px;
                position: relative;
                img{
                    width: 50px;
                    height: 50px;
                    position: absolute;
                    border-radius: 40px;
                    top: 12px;
                    left: 20px;
                }
                h3{
                    position: absolute;
                    left: 80px;
                    top: 5px;
                    font-weight: 500;
                }
                div{
                    position: absolute;
                    left: 80px;
                    bottom: 5px;
                    font-weight: 600;
                }
                .time{
                    position: absolute;
                    left: 280px;
                    top: 5px;
                    color: #979090;
                }
            }
            .lie3{
                width: 100%;
                height: 65px;
                border: solid 1px #c3bcbc;
                margin-top: -20px;
                position: relative;
                img{
                    width: 50px;
                    height: 50px;
                    position: absolute;
                    border-radius: 40px;
                    top: 12px;
                    left: 20px;
                }
                h3{
                    position: absolute;
                    left: 80px;
                    top: 5px;
                    font-weight: 500;
                }
                div{
                    position: absolute;
                    left: 80px;
                    bottom: 5px;
                    font-weight: 600;
                }
                .time{
                    position: absolute;
                    left: 280px;
                    top: 5px;
                    color: #979090;
                }
            }
            .lie4{
                width: 100%;
                height: 65px;
                border: solid 1px hsl(0, 6%, 75%);
                margin-top: -20px;
                position: relative;
                img{
                    width: 50px;
                    height: 50px;
                    position: absolute;
                    border-radius: 40px;
                    top: 12px;
                    left: 20px;
                }
                h3{
                    position: absolute;
                    left: 80px;
                    top: 5px;
                    font-weight: 500;
                }
                div{
                    position: absolute;
                    left: 80px;
                    bottom: 5px;
                    font-weight: 600;
                }
                .time{
                    position: absolute;
                    left: 280px;
                    top: 5px;
                    color: #979090;
                }
            }
            .lie5{
                width: 100%;
                height: 65px;
                border: solid 1px #c3bcbc;
                margin-top: -20px;
                position: relative;
                img{
                    width: 50px;
                    height: 50px;
                    position: absolute;
                    border-radius: 40px;
                    top: 12px;
                    left: 20px;
                }
                h3{
                    position: absolute;
                    left: 80px;
                    top: 5px;
                    font-weight: 500;
                }
                div{
                    position: absolute;
                    left: 80px;
                    bottom: 5px;
                    font-weight: 600;
                }
                .time{
                    position: absolute;
                    left: 280px;
                    top: 5px;
                    color: #979090;
                }
            }
    }
</style>